import { createRouter, createWebHistory } from 'vue-router'
import Home from '../views/Home.vue'
import Register from '../views/Register.vue'
import Login from '../views/Login.vue'
import Books from '../views/Books.vue'
import Addbooks from '../views/AddBooks.vue'
import Instr from '../views/instr.vue'
import UserRegister from '../user/UserRegister.vue'
import UserLogin  from '../user/UserLogin.vue'
import User  from '../user/User.vue'

const routes = [
  {
    path: '/',
    name: 'Home',
    component: Home
  },
  {
    path: '/register',
    name: 'Register',
    component: Register
  },
  {
    path: '/login',
    name: 'Login',
    component: Login
  },
  {
    path: '/books',
    name: 'Books',
    component: Books
  },
  {
    path: '/addbooks',
    name: 'Addbooks',
    component: Addbooks
  },
  {
    path: '/instr',
    name: 'Instr',
    component: Instr
  },
  {
    path: '/user_register',
    name: 'UserRegister',
    component: UserRegister
  },
  {
    path: '/user_login',
    name: 'UserLogin',
    component: UserLogin
  },
  {
    path: '/user',
    name: 'User',
    component: User
  },      
  {
    path: '/about',
    name: 'About',
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: function () {
      return import(/* webpackChunkName: "about" */ '../views/About.vue')
    }
  }
]

const router = createRouter({
  history: createWebHistory(process.env.BASE_URL),
  routes
})

export default router
